<template>
    <d2-container :filename="filename">
        <template slot="header">
            <el-form :inline="true" size="mini">
                <el-button type="primary" size="mini" @click="add" icon="el-icon-circle-plus-outline">新增</el-button>
                <el-input size="mini" v-model="queryParam.name" placeholder="名称或编码" style="width: 100px;margin-left: 10px;"/>
                <el-button size="mini" title="刷新" @click="getList" icon="el-icon-refresh" circle style="margin-left: 5px;"></el-button>
            </el-form>
        </template>
        <el-table v-loading="listLoading" :data="tableData" border>
            <el-table-column label="业务编号" width="180" align="center">
                <template slot-scope="scope">
                    <span>{{scope.row.id}}</span>
                </template>
            </el-table-column>
            <el-table-column label="名称" width="120" align="center">
                <template slot-scope="scope">
                    <span>{{scope.row.name}}</span>
                </template>
            </el-table-column>
            <el-table-column label="财务类型" width="120" align="center">
                <template slot-scope="scope">
                    <span>{{scope.row.direction}}</span>
                </template>
            </el-table-column>
            <el-table-column label="业务编码" width="90" align="center" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <span>{{scope.row.code}}</span>
                </template>
            </el-table-column>
            <el-table-column label="业务ID" min-width="180" align="center" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <span>{{scope.row.biz_id}}</span>
                </template>
            </el-table-column>
            <el-table-column label="业务秘钥" min-width="180" align="center" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <span>{{scope.row.biz_secret}}</span>
                </template>
            </el-table-column>
            <el-table-column label="交换机" min-width="150" align="center" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <span>{{scope.row.exchange}}</span>
                </template>
            </el-table-column>
            <el-table-column label="队列名称" min-width="120" align="center" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <span>{{scope.row.queue_name}}</span>
                </template>
            </el-table-column>
            <el-table-column label="路由键值" width="90" align="center" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <span>{{scope.row.routing_key}}</span>
                </template>
            </el-table-column>
            <el-table-column label="阈值" width="90" align="center">
                <template slot-scope="scope">
                    <span>{{scope.row.threshold}}</span>
                </template>
            </el-table-column>
            <el-table-column label="操作" fixed="right" min-width="150px" align="center">
                <template slot-scope="scope">
                    <el-button size="mini" plain icon="el-icon-edit"
                               @click="edit(scope.row)"
                               type="success">编辑
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <data-form ref="dataForm"></data-form>
        <template slot="footer">
            <pagination v-show="total>0"
                        :total="total"
                        :page.sync="queryParam.current"
                        :limit.sync="queryParam.size"
                        @pagination="getList"/>
        </template>

    </d2-container>
</template>

<script>
  import {page} from '../../../api/trade/biz'
  import Pagination from '@/components/Pagination'
  import DataForm from './components/DataForm'

  const defaultBizType = {
    id: undefined,
    name: undefined,
    title: undefined,
    biz_id: undefined,
    biz_secret: undefined,
    code: undefined,
    enabled: false,
    direction: undefined,
    queue_name: undefined,
    exchange: undefined,
    routing_key: undefined,
    threshold: undefined
  }

  export default {
    name: 'trade-biz',
    components: {
      DataForm,
      Pagination
    },
    data () {
      return {
        filename: __filename,
        listLoading: false,
        tableData: [],
        total: 0,
        queryParam: {
          current: 1,
          size: 10
        }
      }
    },
    created() {
      this.getList();
    },
    methods: {
      getList() {
        page(this.queryParam).then(res => {
          this.total = parseInt(res.total);
          this.tableData = res.records;
        })
      },
      add() {
        this.$refs.dataForm.open('create', {})
      },
      edit(row) {
        console.log(row);
        this.$refs.dataForm.open('update', row)
      }
    }
  }
</script>
